<template>
    <view class="container">
        <!-- 数据统计部分 -->
        <view class="statistics-section">
            <uni-segmented-control :current="currentTimeType" :values="timeTypes" @clickItem="handleTimeTypeChange" />
            <view class="stats-cards">
                <view class="stats-card">
                    <text class="stats-value">{{ statisticsData.totalOrders }}</text>
                    <text class="stats-label">总订单数</text>
                </view>
                <view class="stats-card">
                    <text class="stats-value">¥{{ statisticsData.totalAmount }}</text>
                    <text class="stats-label">总金额</text>
                </view>
                <view class="stats-card">
                    <text class="stats-value">{{ statisticsData.avgAmount }}</text>
                    <text class="stats-label">客单价</text>
                </view>
            </view>
        </view>

        <!-- 订单列表 -->
        <view class="order-list">
            <uni-list v-if="orderList.length>0">
                <uni-list-item v-for="order in orderList" :key="order.id" :title="order.id"
                    :note="`金额：¥${order.paymd} | 时间：${order.create}`">
                    <template v-slot:footer>
                        <view class="list-item-right">
                            <uni-tag :text="order.status" :type="order.status=='已支付'?'success':''" size="small" />
                            <uni-checkbox :value="selectedOrders.includes(order.id)" @click="toggleSelect(order.id)" />
                        </view>
                    </template>
                </uni-list-item>
            </uni-list>
            <uni-load-more v-if="orderList.length==0" :status="loadStatus" />
        </view>

        <!-- 批量操作工具栏 -->
        <view v-if="selectedOrders.length" class="batch-toolbar">
            <text class="selected-count">已选{{ selectedOrders.length }}项</text>
            <uni-icons type="trash" size="24" @click="handleBatchDelete" />
            <uni-icons type="download" size="24" @click="handleBatchExport" />
        </view>
    </view>
</template>

<script>
    import {
        isLogin
    } from '../tools/tools'
	import {Get_orders} from "../apis/login.js"
    export default {
        data() {
            return {
                currentTimeType: 0,
                timeTypes: ['今日', '本月', '今年'],
                statisticsData: {
                    totalOrders: 0,
                    totalAmount: 0,
                    avgAmount: 0
                },
                orderList: [],
                selectedOrders: [],
                pageParams: {
                    page: 1,
                    pageSize: 15,
                    total: 0
                },
                loadStatus: 'more'
            }
        },
        mounted() {
            this.loadStatistics()
            this.loadOrderList()
        },
        methods: {
            handleTimeTypeChange(e) {
                this.currentTimeType = e.currentIndex
                this.loadStatistics()
            },

            async loadStatistics() {
                // 模拟接口请求
                const timeType = ['day', 'month', 'year'][this.currentTimeType]
                const res = await Get_orders({
                    timeType
                })
				if(res.code===0){
					this.statisticsData = res.data.data[0];
					this.orderList=res.data.data[0].orderList;
				}
                
            },

            async loadOrderList() {
                this.loadStatus = 'loading'
                const params = {
                    page: this.pageParams.page,
                    pageSize: this.pageParams.pageSize,
                    status: 'completed'
                }

                const res = await this.$api.getOrderList(params)
                this.orderList = [...this.orderList, ...res.data.list]
                this.pageParams.total = res.data.total

                this.loadStatus = this.orderList.length >= this.pageParams.total ? 'noMore' : 'more'
            },

            toggleSelect(orderId) {
                const index = this.selectedOrders.indexOf(orderId)
                if (index > -1) {
                    this.selectedOrders.splice(index, 1)
                } else {
                    this.selectedOrders.push(orderId)
                }
            },

            handleBatchDelete() {
                uni.showModal({
                    title: '确认删除',
                    content: `确定要删除选中的${this.selectedOrders.length}个订单吗？`,
                    success: async (res) => {
                        if (res.confirm) {
                            await this.$api.batchDeleteOrders(this.selectedOrders)
                            this.selectedOrders = []
                            this.loadOrderList()
                        }
                    }
                })
            },

            handleBatchExport() {
                // 导出逻辑
            },

            onReachBottom() {
                if (this.loadStatus === 'more') {
                    this.pageParams.page++
                    this.loadOrderList()
                }
            }
        },
        onShow: async () => {
            isLogin()
        }
    }
</script>

<style scoped>
    .container {
        padding-bottom: 100rpx;
    }

    .stats-cards {
        display: flex;
        justify-content: space-around;
        padding: 20rpx;
    }

    .stats-card {
        text-align: center;
        padding: 20rpx;
    }

    .stats-value {
        display: block;
        font-size: 36rpx;
        font-weight: bold;
        color: #333;
    }

    .stats-label {
        display: block;
        font-size: 24rpx;
        color: #666;
    }

    .list-item-right {
        display: flex;
        align-items: center;
        gap: 20rpx;
    }

    .batch-toolbar {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        height: 100rpx;
        background: #fff;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 30rpx;
        box-shadow: 0 -2rpx 12rpx rgba(0, 0, 0, 0.1);
    }

    .selected-count {
        font-size: 28rpx;
        color: #666;
    }
</style>